<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>全球新型冠状病毒统计</title>
        <script src="js/echarts.js"></script>
    </head>

    <body background="backGround.png">
        <div style="text-align: center">

            <div>
                <form action="/index.html">
                    <input type="text" placeholder="Entry country or province/state..." name="key" style="width: 190px; padding-top: 3px;"/>
                    <input type="submit" value="提交"/>
                </form>
            </div>

            <div style="margin-top: 10px;">
                <table border="1" style="margin: auto; color: orange;">
                    <tr>
                        <th style="width: 150px;">Country</th>
                        <th style="width: 150px;">Province/State</th>
                        <th style="width: 150px;">diffFromPrevDay</th>
                        <th style="width: 150px;">latestTotalCases</th>
                    </tr>
                    <tr th:each="virusData : ${virusDataList}">
                        <td style="width: 150px;" th:text="${virusData.country}"/>
                        <td style="width: 150px;" th:text="${virusData.state}"/>
                        <td style="width: 150px;" th:text="${virusData.diffFromPrevDay}"/>
                        <td style="width: 150px;" th:text="${virusData.latestTotalCases}"/>
                    </tr>
                </table>
            </div>
        </div>
    </body>

</html>